<template>
  <el-dialog
    v-model="dialogVisible"
    :before-close="closeDialog"
    title="管点编辑"
    width="800"
  >
    <!-- 1 -->
    <div class="line">
      <div class="colum">
        <span>编号</span>
        <el-input v-model="updateData.number"></el-input>
      </div>
      <div class="colum">
        <span>类型</span>
        <el-input v-model="updateData.type"></el-input>
      </div>
    </div>
    <!-- 2 -->
    <div class="line">
      <div class="colum">
        <span>井深</span>
        <el-input v-model="updateData.depth"></el-input>
      </div>
      <div class="colum">
        <span>高程</span>
        <el-input v-model="updateData.elevation"></el-input>
      </div>
    </div>
    <!-- 3 -->
    <div class="line">
      <div class="colum">
        <span>特征</span>
        <el-input v-model="updateData.feature"></el-input>
      </div>
      <div class="colum">
        <span>地址</span>
        <el-input v-model="updateData.address"></el-input>
      </div>
    </div>
    <!-- 4 -->
    <div class="line">
      <div class="colum">
        <span>类别</span>
        <el-input v-model="updateData.level"></el-input>
      </div>
      <div class="colum">
        <span>探测时间</span>
        <el-input v-model="updateData.date"></el-input>
      </div>
    </div>
    <!-- 5 -->
    <div class="line">
      <div class="colum">
        <span>探测单位</span>
        <el-input v-model="updateData.dw"></el-input>
      </div>
      <div class="colum">
        <span>探测人员</span>
        <el-input v-model="updateData.person"></el-input>
      </div>
    </div>
    <!-- 6 -->
    <div class="line">
      <div class="colum">
        <span>过程检查人员</span>
        <el-input v-model="updateData.cheackperson"></el-input>
      </div>
      <div class="colum">
        <span>x坐标</span>
        <el-input v-model="updateData.x"></el-input>
      </div>
    </div>
    <!-- 7 -->
    <div class="line">
      <div class="colum">
        <span>最终检查人员</span>
        <el-input v-model="updateData.topperson"></el-input>
      </div>
      <div class="colum">
        <span>y坐标</span>
        <el-input v-model="updateData.y"></el-input>
      </div>
    </div>
    <!-- 8 -->
    <div class="line">
      <div class="colum">
        <span>权属单位</span>
        <el-input v-model="updateData.ownerunit"></el-input>
      </div>
      <div class="colum">
        <span>备注</span>
        <el-input v-model="updateData.note"></el-input>
      </div>
    </div>
    <template #footer>
      <div class="dialog-footer">
        <el-button @click="closeDialog">取消</el-button>
        <el-button type="primary" @click="postPointChange"> 确定 </el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script setup>
import { reactive } from "vue";
import { getPieplePointList,editPieplePoint} from "@/api/manager/manager";

let dialogVisible = true;

let updateData = reactive({
  id:"",
  number: "",
  type: "",
  depth: "",
  elevation: "",
  feature: "",
  address: "",
  level: "",
  date: "",
  dw: "",
  person: "",
  cheackperson: "",
  x: "",
  topperson: "",
  y: "",
  ownerunit: "",
  note: "",
});

const res = defineProps({
  row: Object,
});

// 自定义父组件刷新
const emits = defineEmits(["RefreshFee"]);
const RefreshFee = () => {
  emits("RefreshFee");
};

let { row } = toRefs(res);
console.log(row);

function closeDialog() {
  RefreshFee();
}


function postPointChange(){
  let addPipePoint = {
    gid:updateData.id,
    expNo:updateData.number,
    subsid:updateData.type,
    welldeep:updateData.depth,
    surH:updateData.elevation,
    feature:updateData.feature,
    address:updateData.address,
    grade:updateData.level,
    sdate:updateData.date,
    sunit:updateData.dw,
    sperson:updateData.person,
    processCheckPerson:updateData.cheackperson,
    x:updateData.x,
    finalCheckPerson:updateData.topperson,
    y:updateData.y,
    arrunitc:updateData.ownerunit,
    remark:updateData.note
  }
  editPieplePoint(addPipePoint).then(res =>{
    if(res.code == 200){
      RefreshFee();
    }
  })
}

getPieplePointList({
  expNo: row.value.pipnumber,
  /** 类型 */
  pipeTyp: "",
  /** 管线名称 */
  subsid: "",
  pageNum: 1,
  pageSize: 3,
}).then((res)=>{
    let data = res.data.records[0]
    if(res.data.records.length == 1){
        updateData.id = data.gid;
        updateData.number = data.expNo;
        updateData.type = data.subsid;
        updateData.depth = data.welldeep;
        updateData.elevation = data.surH;
        updateData.feature = data.feature;
        updateData.address = data.address;
        updateData.level = data.grade;
        updateData.date = data.sdate;
        updateData.dw = data.sunit;
        updateData.person = data.sperson;
        updateData.cheackperson = data.processCheckPerson;
        updateData.x = data.x;
        updateData.topperson = data.finalCheckPerson;
        updateData.y = data.y;
        updateData.ownerunit = data.arrunitc;
        updateData.note = data.remark;
    }
});
</script>

<style>
.el-dialog .line {
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  margin-top: 20px;
}

.el-dialog .line .colum {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.el-dialog .line span {
  display: flex;
  justify-content: center;
  width: 130px;
  font-weight: 400;
}
</style>
